﻿<!doctype html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>投票</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="Expires" content="-1">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta http-equiv="Pragma" content="no-cache">
    <link rel="stylesheet" type="text/css" href="Content/menu.css" media="all">
</head>
<body>
<div style="font-size: 18px">
    请选择项目种类：
    <select style="font-size: 18px" id="projectType" onchange="changeType()">
        <option value="1">党建和精神文明类</option>
        <option value="2">公共管理类</option>
        <option value="3">经济建设类</option>
    </select>
</div>
<div class="content">
    <div id="pageCon" class="match_page masonry" style="padding-bottom: 30px">
        <ul class="list_box masonry clearfix">
        </ul>
    </div>
</div>
    <script src="Scripts/jquery-1.10.2.min.js"></script>
    <script src="Scripts/jquery.masonry.min.js"></script>
<script type="text/javascript">
    var voteResult; 
    $(function () {
        var container = $('#pageCon ul');
        changeType(1);
        container.imagesLoaded(function() {
            container.masonry({
                itemSelector: '.picCon'
            });
        });
    });

    //切换项目类型和页面初始化都需要调用
    function changeType(typeid) {
        var container = $('#pageCon ul');
        var typeindex;
        if (typeof typeid === "number") {
            typeindex = typeid;
        } else {
            typeindex = $('#projectType')[0].selectedIndex + 1;
        }
        $.getJSON('ProjectManager.ashx', 'type=sel&projectType=' + typeindex, function (msg) {
            updateUI(msg,container);

            //判断设备Mac查记录
            $.get('ProjectManager.ashx', 'type=mac', function (message) {
                if (message === null || message === "") {
                    return;
                }
                var record = JSON.parse(message);
                voteResult = { "type1": [], "type2": [], "type3": [] };
                voteResult = record;
                var key = "type" + typeindex;
                if (record[key].length >= 2) {
                    for (var j = 0; j < msg.length; j++) {
                        $(container[j]).find("li div.tou a.vote").css("background-color", "gray").attr("href", "javascript:void(0)");
                    }
                    $("#" + record[key][0]).html("已投");
                    $("#" + record[key][1]).html("已投");
                } else if (record[key].length == 1) {
                    $("#" + record[key]).css("background-color", "gray").attr("href", "javascript:void(0)").html("已投");
                }
            });

        });
    }

    //更新项目的显示
    function updateUI(projectList,container) {
        var typeindex = $('#projectType')[0].selectedIndex + 1;
        container.empty();
        for (var i = 0; i < projectList.length; i++) {
            var strLi = '<li class="picCon masonry-brick">';
            strLi += '      <div>';
            strLi += '          <i class="number">' + projectList[i].ProjectID + '号</i>';
            strLi += '          <a href="javascript:void(0)" class="img">';
            strLi += '              <img src="Content/Images/' + projectList[i].ProjectImage + '" />';
            strLi += '          </a>';
            strLi += '          <div class="tou">';
            strLi += '              <div class="divP">';
            strLi += '                  <span>' + projectList[i].ProjectName + '</span>';
            strLi += '                  <span>' + projectList[i].ProjectNumber + '票</span>';
            strLi += '               </div>';
            strLi += '              <a id=' + projectList[i].ProjectID + ' href="javascript:vote(' + projectList[i].ProjectID + ',' + typeindex + ')" class="vote">投票</a>';
            strLi += '          </div>';
            strLi += '      </div>';
            strLi += '   </li>';
            container.append(strLi);
        }
    }

    //点击投票触发函数
    function vote(pid,tid) {
        //TODO 待测试
        if (typeof voteResult === 'undefined') {
            voteResult = { "type1": [], "type2": [], "type3": [] };
        }
        //如果已近存在表示已投，防止同一项目被投两次
        for (var i = 0; i < voteResult['type' + tid].length; i++) {
            if (voteResult['type' + tid][i] == pid) {
                return;
            }
        }
        voteResult['type' + tid].push(pid);
        
        //TODO VoteResult
        $.post('ProjectManager.ashx?type=vote', { 'pid': pid, 'voted': JSON.stringify(voteResult) }, function (msg) {
            var result = msg.split('|');
            changeType();
            alert(result[0]);
            console.log(msg);
        });
    }
</script>
</body>
</html>
